{% extends "../templates/index.html" %}
{% block concent %}
{#    <head>#}
{#        <meta charset="UTF-8">#}
{#        <title>任务列表</title>#}
{#    </head>#}
{#    <body>#}
{#        <h3>任务列表</h3>#}
{#        <a href="{% url 'tasks:task_create' %}">#}
{#            <button type="button" class="layui-btn">添加任务</button>#}
{#        </a>#}
{#        <table>#}
{#            <tr>#}
{#                <th>序号</th>#}
{#                <th>名称</th>#}
{#                <th>状态</th>#}
{#                <th>操作</th>#}
{#            </tr>#}
{#        {% for task in tasks %}#}
{#            <tr>#}
{#                <td>{{ forloop.counter }}</td>#}
{#                <td>{{ task.name }}</td>#}
{#                <td>{{ task.get_status_display }}</td>#}
{#                <td><a href="{% url 'tasks:task_update' task.id %}"><button type="button" class="layui-btn layui-btn-normal layui-btn-xs">修改任务</button></a>#}
{#                <a href="{% url 'tasks:task_delete' task.id %}"><button type="button" class="layui-btn layui-btn-danger layui-btn-xs">删除任务</button></a></td>#}
{#            </tr>#}
{#        {% endfor %}#}
{#        </table>#}
{#    </body>#}
    <table  id="test"></table>
    <script>
        let tasks = {{tasks|safe}}
            layui.use('table', function () {
                const table = layui.table;
                table.render({
                    elem: '#test'
                    , cols: [[
                        {field: 'id', width: 80, title: 'ID', sort: true}
                        , {field: 'name', width: 80, title: '用户名'}
                        , {field: 'status', width: 80, title: '状态', sort: true}
                    ]]
                    , data: tasks
                    , even: true
                });
            });
    </script>
{% endblock %}